<template>
	<view class="news-item" @click="toLink">
		<image :src="info.img" style="width: 120px;height: 72px;min-width: 120px;"></image>
		<view class="up-m-l-24">
			<view class="f-s-14 f-w-b l-h-24 news-title">{{ info.title }}</view>
			<view class="up-flex up-flex-between up-m-t-24">
				<up-icon name="clock" color="#D8D8D8" labelSize="13px" labelColor="#D8D8D8"
					:label="info.createAt"></up-icon>
				<up-icon name="eye" color="#D8D8D8" labelSize="13px" labelColor="#D8D8D8" :label="info.read"></up-icon>
			</view>
		</view>
	</view>
</template>

<script setup>
	import Func from '@/utils/common.js'
	const props = defineProps({
		info: {
			type: Object,
			default: () => {}
		}
	})

	const toLink = () => {
		if (!props.info.link) {
			Func.toast('非公众号文章不支持打开')
			return
		}
		uni.navigateTo({
			url: '/subPackages/app/news/linkInfo?link=' + props.info.link
		})
	}
</script>

<style scoped lang="scss">
	.news-item {
		display: flex;
		align-items: flex-start;
		margin-bottom: 20px;
		padding-bottom: 20px;
		border-bottom: 1px solid #F5F5F5;

		.news-title {
			display: -webkit-box;
			-webkit-box-orient: vertical;
			-webkit-line-clamp: 2;
			overflow: hidden;
			height: 48px;
		}
	}
</style>